﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <link href="../Lib/Css/site.css" rel="stylesheet" />
    <script src="../Lib/Js/jquery.min.js"></script>
    <script src="../Lib/Js/JSXTransformer.js"></script>
    <script src="../Lib/Js/react.js"></script>
</head>
<body>
    <p style="font-weight: bold; font-size: 30px;">
        重头戏：component
    </p>
    <p>React 允许将代码封装成组件（component），然后像插入普通 HTML 标签一样，在网页中插入这个组件。React.createClass 方法就用于生成一个组件类</p>
    <div id="d1"></div>
</body>
</html>
<script type="text/jsx">

    var HelloMessage = React.createClass(
        {
            render:function(){
                return <span className='red'>hello {this.props.name}</span>;
            }
        }
    );

    React.render(
        <HelloMessage name="Damon" />,
        $("#d1").get(0)
    );

</script>
